<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>proxy的基本介绍</title>
</head>

<body>
    <script>
        // 但是这里不是响应式已经
        const user = {
            name: 'rose',
            age: 20
        }
        // 可以使用proxy将这个源对象进行设置
        const a = new Proxy(user, {
            get(a, b) {
                console.log('访问了属性值...', a, b)
                return 200
            },
            set(target, propName, value) {
                // obj 表示源对象
                // propName 表示要操作的属性名
                // value  要修改的值
                console.log('只要设置就会执行这个逻辑...', target, propName, value)
            }
        })
        console.log(a)// a已经被代理了-->proxy
        console.log(a.age) // 访问a中的age属性,走到了get中,
        a.age = 22
    </script>
</body>

</html>